<template>
  <span>倒计时{{ `${day}天${hr}小时${min}分钟${sec}秒` }}</span>
</template>

<script>
export default {
  props: ['deadline', 'start'],
  data() {
    return {
      day: 0,
      hr: 0,
      min: 0,
      sec: 0,
    }
  },
  mounted: function () {
    this._interval = setInterval(() => {
      this.countdown()
    }, 1000)
  },
  destroyed() {
    clearInterval(this._interval)
  },
  methods: {
    countdown: function () {
      const end = Date.parse(new Date('2022-01-09 21:00'))
      const now = Date.parse(new Date())
      const msec = end - now
      let day = parseInt(msec / 1000 / 60 / 60 / 24)
      let hr = parseInt((msec / 1000 / 60 / 60) % 24)
      let min = parseInt((msec / 1000 / 60) % 60)
      let sec = parseInt((msec / 1000) % 60)
      this.day = day
      this.hr = hr > 9 ? hr : '0' + hr
      this.min = min > 9 ? min : '0' + min
      this.sec = sec > 9 ? sec : '0' + sec
    },
  },
}
</script>

<style scoped></style>
